// callback 写法
let balls = document.getElementsByClassName('ball--item');
animation(balls[0], 100, 1000, 'left', 3000, 'ease-in', function () {
    animation(balls[1], 100, 800, 'left', 2000, 'ease-in-out', function (){
        animation(balls[2], 100, 1200, 'left', 3500, 'ease-out', function (){
            animation(balls[2], 1200, 100, 'left', 3500, 'ease-out', function (){
                animation(balls[1], 800, 100, 'left', 3500, 'ease-out', function (){
                    animation(balls[0], 1000, 100, 'left', 3500, 'ease-out', function (){

                    })
                })
            })
        })
    })
});

// promise
// 等待总时长是所有之和
function moveBall (dom, start, terminal, prop, duration, timeFunc) {
    return new Promise(function (resolve){
        animation(dom, start, terminal, prop, duration, timeFunc, function () {
            resolve();
        })
    })
}
moveBall(balls[0], 100, 1000, 'left', 3000, 'ease-in')
    .then(function () {return moveBall(balls[0], 100, 1000, 'left', 3000, 'ease-in')})
    .then(function () {return moveBall(balls[1], 100, 1000, 'left', 3000, 'ease-in')})
    .then(function () {return moveBall(balls[2], 100, 1000, 'left', 3000, 'ease-in')})
    .then(function () {return moveBall(balls[2], 100, 1000, 'left', 3000, 'ease-in')})
    .then(function () {return moveBall(balls[1], 100, 1000, 'left', 3000, 'ease-in')})
    .then(function () {return moveBall(balls[0], 100, 1000, 'left', 3000, 'ease-in')})
    .catch(function (error){console.log(error)});
// 等待总时长是所有之中最长的那一步
Promise.all([]);// promise 对象数组




